<template>
	<!--	<a-upload @click.stop ref="uploadRef" @change="onChange" @before-upload="beforeUpload" @progress="onProgress" @success="onSuccess" :custom-request="customRequest" :show-file-list="false">-->
	<!--		<template #upload-button>-->
	<!--			<slot @click="cccc" />-->
	<!--		</template>-->
	<!--	</a-upload>-->
	<div @click="handleUpload" @click.stop>
		<input ref="InputFileRef" type="file" class="hidden" />
		<slot />
	</div>
</template>
<script lang="ts" setup>
// import { type FileItem, type RequestOption } from '@arco-design/web-vue/es/upload/interfaces';
//
// const props = defineProps({
// 	accept: { type: String, default: () => '*' },
// });
//
// function onChange(files: FileItem[], currentFile: FileItem) {
// 	// console.log(files[0].uid);
// 	console.log(currentFile, 1);
// }
//
// function onProgress(currentFile: FileItem) {
// 	console.log(currentFile, 2);
// }
//
// function onSuccess(currentFile: FileItem) {
// 	console.log(currentFile, 3);
// }
//
// function customRequest(option: RequestOption) {
// 	console.log(option, 4);
// }
//
// function beforeUpload() {
// 	return true;
// }
//
import { useEventListener } from '@vueuse/core';

const InputFileRef = ref();

function handleUpload() {
	InputFileRef.value.click();
}

useEventListener(InputFileRef, 'change', (event: Event) => {
	const target = event.target as HTMLInputElement; // 断言为 HTMLInputElement
	console.log(target.files);
	console.log(event);
});
</script>
<style lang="scss" scoped></style>
